import React, { Component } from 'react';
import { InfoWindow } from 'react-amap';
import styles from './MyMarker.less';

const screen = ['off', 'on'];

class MyInfoWindow extends Component {
  constructor(props) {
    super(props);
    this.offset = [0, -20];
    this.state = {
      isClick: false,
    };
  }

  render() {
    return (
      <InfoWindow
        position={this.props.position}
        visible={this.props.visible}
        offset={this.offset}
        {...this.props}
        closeWhenClickMap
      >
        <h3>ID：{this.props.devinfo.devUuid}</h3>
        <div className={styles.info}>
          <div className={styles.left}>
            <p className={styles.ptext}>
              Screen
              <br />
              {screen[this.props.devinfo.scrSwitch]}
            </p>
          </div>
          <div className={styles.right}>
            <p className={styles.ptext}>
              {this.props.devinfo.compName}
              <br />
              {this.props.devinfo.vehLicplateNo}
              <br />
              上线：{this.props.devinfo.lastOnTime}
            </p>
          </div>
        </div>
        <div className={styles.info}>
          <div className={styles.inforow}>
            <p className={styles.itext}>
              {this.props.devinfo.playTimes}
              <br />
              次展示
            </p>
          </div>
          <div className={styles.inforow}>
            <p className={styles.itext}>
              {this.props.devinfo.curDayTotalMileage}
              <br /> 公里
            </p>
          </div>
        </div>
        <div className={styles.info}>
          <div className={styles.inforow}>
            <p className={styles.itext}>
              温度（℃）
              <br /> {this.props.devinfo.boardTemperature}
            </p>
          </div>
          <div className={styles.inforow}>
            <p className={styles.itext}>
              亮度
              <br />
              {this.props.devinfo.brightness}
            </p>
          </div>
        </div>
        <div className={styles.info}>
          <img src={this.props.devinfo.curShowPicUrl} width="250" height="100" alt="展示截屏" />
        </div>
      </InfoWindow>
    );
  }
}

export default MyInfoWindow;
